<template>
    <div>
        <div class="common-top-box clearfix">
            <div class="lefttop-logo-box fl"><img :src="'/api/upload/logo?uuid='+ userId" style="width: 100%;height:100%;" /></div>
            <div class="righttop-cont-box fl">
                <!-- 消息通知 -->
                <div class="notice-box">
                    <marquee class="horn" direction="left" scrolldelay="4" scrollamount="2" behavior="scroll">{{message}}</marquee>
                </div>
                <!-- 一级菜单     其他模块 -->
                <div class="clearfix">
                    <!-- 一级菜单 -->
                    <div class="level-menu-box" @mouseover="menuselectover" @mouseout="menuselectout">
                        <div class="select-box">
                            <p :class="['now-choose',levelmenuState?'menuchoose':'']">{{nowlottery}}</p>
                        </div>
                        <ul class="level-menu-list" v-show="levelmenuState">
                            <!-- <li v-for="(item,index) in levelmenulist" :key="index">
                                <router-link :to="{ path: '/game', query: { id: index+1 }}" @click.native="menuselects(item.name)" class="option-icon">{{item.name}}</router-link>
                            </li> -->
                            <li v-for="(item,index) in levelmenulist" :key="index" @click="menuselects(item.name)" class="option-icon" style="cursor: pointer;">{{item.name}}
                            </li>
                        </ul>
                    </div>
                </div>
                
            </div>
        </div>
        <div>
            <router-view v-if="routerAlive"></router-view>
        </div>
    </div>
</template>
<style>
    html,body{
        background: #fff!important;
    }
</style>
<script>
    var timer = null;
    import '../../assets/css/main.css'
    import axios from 'axios'
    export default {
        data(){
            return{
                levelmenuState: false,   //一级菜单  票种 hover状态
                levelmenulist: [],
                // levelmenulist: [   //一级菜单
                //     {name: 'PC蛋蛋',},
                //     {name: '六合彩',},
                //     {name: '北京PK拾',},
                //     {name: '北京快乐8',},
                //     {name: '幸运飞艇',},
                //     {name: '天津时时彩',},
                //     {name: '新疆时时彩',},
                //     {name: '重庆时时彩',},
                //     {name: '安徽快3',},
                //     {name: '江苏快3',},
                //     {name: '山东11选5',},
                //     {name: '广东11选5',},
                //     {name: '江西11选5',},
                //     {name: '广东快乐十分',},
                //     {name: '重庆幸运农场',},
                //     {name: '吉林快3',},
                // ],
                routerAlive: true,  //渲染状态
                nowlottery: '',  //当前彩票
                message: '欢迎使用',  //消息通知
                userId: '',
                pathId: -1,  //
            }
        },
        methods: {
            init(){

                var _this = this;
                
                if(window.localStorage.Authorization){

                    _this.userId = window.localStorage.Authorization;

                    if (timer) {
                        clearInterval(timer);
                        timer = null;
                    }
                    
                    _this.$httpGet('/api/other/last').then(data => {
                        // console.log(data);
                        if(data.length && data.length != 0){
                            _this.message = data.data[0].message;

                            timer = setInterval(() => {
                                _this.inits();
                            }, 20 * 1000)
                        }

                    });

                }

                if(window.localStorage.Authorization){
                    //登录后首次请求

                    this.$httpGet('/api/auth').then(response => {
                    
                        if(response.status == 200){
                            
                            window.localStorage.pan = response.data.pan[0];
                            window.localStorage.accountname = response.data.name;
                            window.localStorage.deal_type = response.data.deal_type[0];
                            //一级菜单
                            for(var i in response.data.games){
                                if(response.data.games[i]){
                                    _this.levelmenulist.push({'name': i});
                                }
                            }

                            _this.pathId = _this.getId(response.data.default_game);

                            _this.nowlottery = response.data.default_game;
                            
                            //默认跳转路由
                            _this.$router.push({
                                path:'/game',
                                query:{
                                    id: _this.pathId,  
                                }
                            })
                            

                        }

                    });
                    
                }
                
            },
            inits(){
                var _this = this;
                
                if(window.localStorage.Authorization){

                    if (timer) {
                        clearInterval(timer);
                        timer = null;
                    }
                    
                    _this.$httpGet('/api/other/last').then(data => {
                        // console.log(data);
                        if(data.length && data.length != 0){
                            _this.message = data.data[0].message;

                            timer = setInterval(() => {
                                _this.inits();
                            }, 20 * 1000)
                        }

                    });

                }
            },
            // 一级菜单悬停
            menuselectover(){
                this.levelmenuState = true;
            },
            // 一级菜单移出
            menuselectout(){
                this.levelmenuState = false;
            },
            // 一级菜单切换
            menuselects(now){
                // 隐藏菜单选项
                this.levelmenuState = false;
                //当前选中彩票票种
                this.nowlottery = now;
                // 刷新路由
                this.routerAlive = false;
                this.$nextTick(()=>{
                    this.routerAlive = true;
                });

                this.$router.push({
                    path:'/game',
                    query:{
                        id: this.getId(now),  
                    }
                })
            },
            getId(name){

                if(name == 'PC蛋蛋'){
                    return 1;
                }else if(name == '六合彩'){
                    return 2;
                }else if(name == '北京PK拾'){
                    return 3;
                }else if(name == '北京快乐8'){
                    return 4;
                }else if(name == '幸运飞艇'){
                    return 5;
                }else if(name == '天津时时彩'){
                    return 6;
                }else if(name == '新疆时时彩'){
                    return 7;
                }else if(name == '重庆时时彩'){
                    return 8;
                }else if(name == '安徽快3'){
                    return 9;
                }else if(name == '江苏快3'){
                    return 10;
                }else if(name == '山东11选5'){
                    return 11;
                }else if(name == '广东11选5'){
                    return 12;
                }else if(name == '江西11选5'){
                    return 13;
                }else if(name == '广东快乐十分'){
                    return 14;
                }else if(name == '重庆幸运农场'){
                    return 15;
                }else if(name == '吉林快3'){
                    return 16;
                }else{
                    return 17;
                }
            },
        },
        mounted(){
            this.init();
        },
        beforeDestroy(){
            clearInterval(timer);
        },
    }
</script>
